import react from 'react'
import MyLayout from "@/layout/MyLayout.tsx";
import {Outlet} from 'react-router-dom'
import ErrorPage from '@/404.tsx'
import {DatabaseOutlined, MehTwoTone} from '@ant-design/icons'
import Flex from '@/view/flex/Flex'

export interface IRouter {
    path: string
    element: react.ReactElement
    title: string
    icon?: react.ReactNode
    children?: IRouter[]
    isNoAuth?: boolean // true 表示不需要权限 false || undefined 表示需要权限
    loader?: any
}

const router: IRouter[] = [
    {
        path: '/',
        element:
            <MyLayout><Outlet/></MyLayout>,
        title: '',
        isNoAuth: true,
        children: [
            {
                path: '/home',
                element: <Flex/>,
                title: 'flex布局',
                icon: <DatabaseOutlined/>,
                isNoAuth: true
            },
            {
                path: '/gradient',
                element: <Outlet/>,
                title: '渐变盒子',
                icon: <MehTwoTone/>,
                isNoAuth: true,
                children: [
                    {
                        path: 'flex22',
                        element: <Flex/>,
                        title: 'flex布局',
                        icon: <DatabaseOutlined/>,
                        isNoAuth: true,
                    },
                    {
                        path: 'gradient22',
                        element: <Outlet/>,
                        title: '渐变盒子',
                        icon: <DatabaseOutlined/>,
                        isNoAuth: true,
                        children: [
                            {
                                path: 'flex33',
                                element: <Flex/>,
                                title: 'flex布局',
                                isNoAuth: true,
                                icon: <DatabaseOutlined/>
                            },
                            {
                                path: 'gradient33',
                                element: <div>还没写呢</div>,
                                title: '渐变盒子2',
                                isNoAuth: true,
                                icon: <DatabaseOutlined/>
                            },
                        ]
                    },
                ]
            },
        ]
    },
    {
        path: '/login',
        title: '登录',
        element: <div>登录页面</div>,
        isNoAuth: true
    },
    {
        path: '*',
        element: <ErrorPage/>,
        title: '404',
        isNoAuth: true
    }
]

export default router

const routerArr = router.flatMap((item) => item.children || []).concat(router)

export {
    routerArr
}